<template>
  <div class="table">
    <!--表11____县生产信息调查统计表T_MulProdInfoChart-->
    <div class="divSearch">
      <Row>
        <Col span="24" class="col-margin"> 填报年度：
          <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="GetData()">
              <Option value="">全部</Option>
              <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
          </Select>
          <Button icon="ios-search" type="ghost" @click="GetData()" class="ButtonStyle">
              查询
          </Button>
          <Button icon="ios-download" type="primary" @click="ExcelDown()" class="searchButton" style="float:right;width: 100px;">数据导出</Button>
          <Upload :on-success="handleSuccess" :action="GetPostUrl()" style="float:right;width: 100px;" v-show="DataModel.ReportStatus <3">
            <Button type="primary" icon="ios-cloud-upload-outline" class="searchButton">数据导入</Button>
          </Upload>
          <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton" style="width: 100px;">模板下载</Button>
          <!-- <label style="float:right;padding: 6px;font-size:16px;">当前状态:
              <span v-if="DataModel.ReportStatus==0" class="Error"></span> 
              <span v-else-if="DataModel.ReportStatus==1" class="NoReport">未填写</span>
              <span v-else-if="DataModel.ReportStatus==2" class="AlreadyReport">已填写</span>
              <span v-else-if="DataModel.ReportStatus==3" class="UpReport">已上报</span>
              <span v-else-if="DataModel.ReportStatus==4" class="Success">审核通过</span>  
              <span v-else  class="NoReport">无需填报</span>             
          </label> -->
        </Col>
      </Row>
    </div>
    <Row>
      <Col span="24">
      <Form ref="DataModel" :model="DataModel" :rules="ruleModel" style="margin-bottom:20px">
        <table class="reptable">
          <caption>
              <label style="float:left">{{searchModel.FillInYear}}表11全年桑蚕种场生产经营情况调查表</label>
              <label style="float:right">当前状态:
              <span v-if="DataModel.ReportStatus==0" class="Error">重新填写</span> 
              <span v-else-if="DataModel.ReportStatus==1" class="NoReport">未填写</span>
              <span v-else-if="DataModel.ReportStatus==2" class="AlreadyReport">已填写</span>
              <span v-else-if="DataModel.ReportStatus==3" class="UpReport">已上报</span>
              <span v-else-if="DataModel.ReportStatus==4" class="Success">审核通过</span>                  
              <span v-else class="NoReport">无需填报</span>                  
              </label><br/>
          </caption>
          <tr>
            <th colspan="3">职工人数（人）</th>
            <th rowspan="2">生产用房面积（m²）</th>
            <th rowspan="2">自有桑园面积 (亩)</th>
            <th colspan="2">桑蚕种产量(万张)</th>
            <th colspan="2">销售蚕种量(万张)</th>
            <th rowspan="2">固定资产<br/>(万元)</th>
            <th rowspan="2">蚕种总产值<br/>（万元）</th>
            <th rowspan="2">成本（万元）</th>
            <th rowspan="2">利润（万元）</th>
            <th rowspan="2">备注</th>
          </tr>
          <tr>
            <th>人员<br/>总数</th>
            <th>科技<br/>人员</th>
            <th>高级<br/>职称</th>
            <th>原种</th>
            <th>杂交种</th>
            <th>原种</th>
            <th>杂交种</th>
          </tr>
          <tr>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="PersonalTotal">
                <Input v-model="DataModel.PersonalTotal"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="KJRYNum">
                <Input v-model="DataModel.KJRYNum"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="GJZCNum">
                <Input v-model="DataModel.GJZCNum"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="SCYFMJ">
                <Input v-model="DataModel.SCYFMJ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="ZYSYMJ">
                <Input v-model="DataModel.ZYSYMJ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="SCZCL_YZ">
                <Input v-model="DataModel.SCZCL_YZ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="SCZCL_ZJ">
                <Input v-model="DataModel.SCZCL_ZJ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="CZXS_YZ">
                <Input v-model="DataModel.CZXS_YZ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="CZXS_ZJ">
                <Input v-model="DataModel.CZXS_ZJ"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="FixedAssets">
                <Input v-model="DataModel.FixedAssets"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="MulSilkwormProduct">
                <Input v-model="DataModel.MulSilkwormProduct"></Input>
              </Form-item>              
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="Cost">
                <Input v-model="DataModel.Cost"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="Profit">
                <Input v-model="DataModel.Profit"></Input>
              </Form-item>
            </td>
            <td style="text-align:center;width:7%;" >
              <Form-item prop="Remark">
                <Input v-model="DataModel.Remark"></Input>
              </Form-item>
            </td>
          </tr>
        </table>
      </Form>
      <div class="divButton">
        <Button type="primary" @click="save('DataModel')" :disabled="DataModel.ReportStatus < 3 && this.BtnSaveStatus?false:true">保存</Button>
        <Button type="primary" @click="DataUp()" :disabled="DataModel.ReportStatus == 2 ? false:true">上报</Button>
      </div>
      <Alert banner type="error">
        <!-- <p style="color:red;">填报说明:</p> -->
        <!-- <p>此表由蚕种场填报。</p>  -->
        <p style="color:red;font-size: 16px;padding-top: 10px;">注意：若指标项没有数据，请直接填“0”</p>
        <span slot="desc"></span>
      </Alert>
      </Col>
    </Row>
  </div>
  </template>
  <script>
    export default {
      data() {
        //整数或保留一位小数
        const validateData = (rule, value, callback) => {
            var reg = /\S/;
            var temp = /^[0-9]\d*(\.\d+)?$/;//数字验证
            var p=/^[0-9]+([.]{1}[0-9]{1})?$/;//匹配整数或带一个小数
            if (reg.test(value)) {
              if (temp.test(value) == false) 
              {
                callback(new Error("必须是大于等于0的数字"));
              }
              else {
                if(p.test(value)==false)
                {
                  callback(new Error("只能保留一位小数"));
                }
                else{
                  callback();
                }
              }
            } 
            else {
              callback(new Error("不能为空"));
            }
          };
        ///验证整数
        const validateInt = (rule, value, callback) => {
          var reg = /\S/;
          var temp = /^[0-9]\d*(\.\d+)?$/;//数字验证
          var p=/^[0-9]+([.]{1}[0-9]{0})?$/;//匹配整数或带一个小数
          if (reg.test(value)) {
            if (temp.test(value) == false) 
            {
              callback(new Error("必须是大于等于0的数字"));
            }
            else {
              if(p.test(value)==false)
              {
                callback(new Error("只能是整数"));
              }
              else{
                callback();
              }
            }
          } 
          else {
            callback(new Error("不能为空"));
          }
        };
        return {
          datas: {}, //table数据对象
          CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
          CurrentYear:this.GetCurrentYear(),//当前年度
          selectTabName: '',
          BtnSaveStatus: false,//保存按钮开关
          //查询模型：根据需求删除不不要查询条件
          searchModel: {
            ReportCode: 'MulSilkwormField',
            FillInYear: '',
            TimesType: '',
            AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode,
          },
          DataModel: { //编辑模型
            Id: 0,
            ReportId: '',
            PersonalTotal:'',
            KJRYNum:'',
            GJZCNum:'',
            SCYFMJ:'',
            ZYSYMJ:'',
            SCZCL_YZ:'',
            SCZCL_ZJ:'',
            CZXS_YZ:'',
            CZXS_ZJ:'',
            FixedAssets:'',
            MulSilkwormProduct:'',
            Cost:'',
            Profit:'',
            Remark:'',
            ReportStatus:''
          },
          ruleModel:{
                PersonalTotal:[{validator: validateInt, trigger: 'blur'}],
                KJRYNum:[{validator: validateInt, trigger: 'blur'}],
                GJZCNum:[{validator: validateInt, trigger: 'blur'}],
                SCYFMJ:[{validator: validateData, trigger: 'blur'}],
                ZYSYMJ:[{validator: validateData, trigger: 'blur'}],
                SCZCL_YZ:[{validator: validateInt, trigger: 'blur'}],
                SCZCL_ZJ:[{validator: validateInt, trigger: 'blur'}],
                CZXS_YZ:[{validator: validateData, trigger: 'blur'}],
                CZXS_ZJ:[{validator: validateData, trigger: 'blur'}],
                FixedAssets:[{validator: validateData, trigger: 'blur'}],
                MulSilkwormProduct:[{validator: validateData, trigger: 'blur'}],
                Cost:[{validator: validateData, trigger: 'blur'}],
                Profit:[{validator: validateData, trigger: 'blur'}]
            },
          clientHeight: window.innerHeight - 260, //表格默认高度
        }
      },
      mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
          return (() => {
            that.clientHeight = window.innerHeight - 260;
          })()
        };
      },
      methods: {
          //获取今往年数据
        GetData: function () {
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
            } else {
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            self.DataModel={};//清空当前数据            
            self.$http.post("Report/PostData", model).then( //获取数据编辑项的值
                function (res) {
                    if (res.data.list.status == 2 || res.data.list.status == 1) {
                        self.DataModel = res.data.list.model;
                        self.BtnSaveStatus = true;
                    } else {
                        self.DataModel = res.data.list.model;
                        self.$Modal.warning({
                            title: "提示信息",
                            content: res.data.list.message
                        });
                        self.BtnSaveStatus = false;
                    }
                }
            );
        },
        //保存方法
        save(name) {
            var self = this;
            self.$refs[name].validate((valid) => {
              if(valid)
              {
                 this.$http.put('MulSilkwormField', self.DataModel).then(
                  function(res) {
                      if (res.data.status == 1) {
                          self.GetData();
                          self.$Notice.success({
                              title: '数据保存成功！',
                              desc: false
                          });
                      } else {
                          self.$Modal.warning({
                              title: "提示信息",
                              content: "更新失败,请与管理员联系!"
                          });
                      }
                  });
              }
              else{
                this.$Notice.error({
                    title: '数据验证出错,请根据提示操作后再试!',
                    desc: '',
                });
              }
            }); 
        },
        //数据上报
        DataUp() {
            var self = this;
            self.$Modal.confirm({
                title: '提示信息',
                content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
                onOk: () => {
                    var model = new Object();
                    model.Id = self.DataModel.ReportId;
                    model.reportType = '3';
                    model.strMsg = '';
                    this.$http.post("Report/PostUpStatus", model).then(
                        function (res) {
                            if (res.data.status == 1) {
                                self.$Notice.success({ title: '数据上报成功！', desc: false });
                                self.GetData();
                            }
                            else {
                                self.$Modal.error({ title: "提示信息", content: "数据上报失败!" });
                            }
                        }
                    );
                }
            });
        },
        //导入
        GetPostUrl(){
           var url= this.$http.defaults.baseURL +  "Report/PostImportData?FillInYear="+this.searchModel.FillInYear+"&&ReportCode="+this.searchModel.ReportCode+"&&AreaCode="+this.searchModel.AreaCode;
           return url;
        },
        handleSuccess(res, file) {
            var self = this;
            self.GetData();
            self.$Notice.success({
                title: '数据导入成功！',
                desc: false
            });
        },
        //导出
        ExcelDown:function(){
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
            } else {
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            window.open(this.$http.defaults.baseURL + "MulSilkwormField/GetExcelData?ReportCode=" + model.ReportCode+"&&FillInYear="+model.FillInYear+"&&AreaCode="+model.AreaCode);
        },
        //模板下载
        TmpDown: function () {
            window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
      },
      //创建Vue页面方法
      created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.GetData();
      },
      watch: {
        //需要监听的在此处新增监听对象
      }
    }

  </script>
